<template>
    <div>
        <h1>房型添加</h1>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">房间名称</td>
                    <td><input type="text" v-model="info.Name"></td>
                </tr>
                <tr>
                    <td align="right">发布状态</td>
                    <td><input type="radio" name="sta" v-model="info.FXZT":value="true">发布
                        <input type="radio" name="sta" v-model="info.FXZT":value="false">不发布
                    </td>
                </tr>
                <tr>
                    <td align="right">上架状态</td>
                    <td><input type="radio" name="ste" v-model="info.SJZT" :value="true">是
                        <input type="radio" name="ste" v-model="info.SJZT" :value="false">否</td>
                </tr>
                <tr>
                    <td align="right">图片</td>
                    <td><input type="file" @change="imgs">
                    <img :src="info.Img" width="100" height="100" >
                </td>
                </tr>
                <tr>
                    <td align="right">面积</td>
                    <td><input type="text" v-model="info.Mianji"></td>
                </tr>
                <tr>
                    <td align="right"></td>
                    <td><input type="button" value="添加" @click="ok"></td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import{ref, reactive,onMounted} from 'vue'
import axios from 'axios';
import { useRouter,useRoute } from 'vue-router';
const router=useRouter();
const route=useRoute();
let info:any=reactive({
  Name: '',
  FXZT: true,
  SJZT: true,
  Img: '',
  Mianji: 0,
 
})
const imgs=(e:any)=>{
    let obj=e.target.files[0];
    let f=new FormData();
    f.append('file',obj);
    axios({
        url:'/api/Img/Img',
        method:'post',
        data:f
    })
    .then((res)=>{
        console.log(res);
        if(res.data=='不是图片')
    {
        alert('您上传的不是图片')
        return;
    }
    if(res.data=='大于2M')
    {
        alert('您上传的大于2M')
        return;
    }
    info.Img=res.data
    })
    .catch((err)=>{
        console.log(err);
        
    })
}
const ok=()=>{
    axios({
        url:'/api/FX/AddFX',
        method:'post',
        data:info
    })
    .then((res)=>{
        console.log(res);
        if(res.data==-1)
    {
        alert('名字重复')
        return;
    }
    if(res.data>0)
    {
        alert('添加成功')
        router.push('/fxShow');
        return;
    }
    else{
        alert('添加失败')
        return;
    }

    })
    .catch((err)=>{
        console.log(err);
        
    })
}
</script>

<style scoped>

</style>